<template>
	<div class="centertop my-flex-left">
		<div class="usericon">
			<img src="../../assets/centers/touxiang.jpg" v-if="!modelData.headImg"/>
			<img v-else :src="modelData.headImgUrl" />
		</div>
		<div class="userinfos">
			<div class="top my-flex-left">
				<span class="companyname">
					<template v-if="modelData.type==1">
						{{modelData.realName}}
					</template>
					<template v-else>
						{{modelData.shortName}}
					</template>
				</span>
				<span class="level my-flex-center">{{modelData.levelCN}}</span>
			</div>
			<div class="">
				<div class="verfication my-flex-center">
					已认证
				</div>
			</div>
			
		</div>
	</div>
</template>

<script>
	import service from '@/js/common/customerservice.js';
	export default {
		data() {
			return {
				modelData: {},
				msgCount: '',
				companyList:[],
				formVisible: false,
				companyId:''
			};
		},
		async mounted(){
			this.getMsgcount();
			let arr = ['netstat_antup'];
			await this.tool.getDirByKey(this, arr).then(()=>{
				
			});
			this.getUserInfo();
//			if(this.$store.state.userInfo){
//				this.getCenterCompanyList();
//			}
		},
		methods: {
			...service,
		}
	};
</script>

<style lang="less">
	@import '../../less/base/base.less';
	.centertop{
		background: #fff;
		width:1040px;
		height: 80px;
		padding:13px 0 13px 50px;
		.usericon{
			width: 54px;
				height: 54px;
				border-radius: 50%;
				background-color: #f2f2f2;
				border: solid 2px #fff6f6;
			img{
				width: 54px;
				height: 54px;
				border-radius: 50%;
				/*background-color: #f2f2f2;
				border: solid 2px #fff6f6;*/
			}
		}
		.userinfos{
			padding-left:20px;
			height: 100%;
			flex: 1;
			 display: -webkit-box;
    		/* OLD - iOS 6-, Safari 3.1-6 */
		    display: -moz-box;
		    /* OLD - Firefox 19- (buggy but mostly works) */
		    display: -ms-flexbox;
		    /* TWEENER - IE 10 */
		    display: -webkit-flex;
		    /* NEW - Chrome */
		    display: flex;
			justify-content: space-between;
		    /*align-items: center;*/
		    flex-direction: column;
			.top{
				.companyname{
					padding-right:16px;
					min-width: 110px;
				}
				.level{
					font-size:10px;
					background: #eebbbb;
					padding:3px 12px;
					border-radius: 20px;
					color: #fff;
				}
			}
			.verfication{
				font-size: 12px;
				background: #eebbbb;
				width:50px;
				height: 20px;
				border-radius: 20px;
				color: #fff;
			}
		}
	}
	
</style>